<template>
  <div id="app">
    <div class="history">
        <div class="title">
            <div class="t_left">历史记录</div>
            <van-icon name="delete" class="t_right"/>
        </div>
        <div class="box" >
            <van-tag plain  v-for="item in historyarr" :key="item.id" >{{item}}</van-tag>
        </div>
    </div>
    <div class="history">
        <div class="title">
            <div class="t_left">热门搜索</div>
        </div>
        <div class="box" >
            <van-tag plain  v-for="item in historyarr" :key="item.id" >{{item}}</van-tag>
        </div>
    </div>
</div>
</template>

<script>
export default {
    props:["historyarr,hotarr"]
}
</script>

<style lang="less" scoped>
.history{
     margin-bottom: 20px;
    background-color: #fff;
       .title{
            padding: 10px 8px;
            height: 30px;
            font-size: 22px;
           
          .t_left{
              float: left;
          }
          .t_right{
              float:right;
              top: 50%;
              transform: translateY(-50%);
          }
       }
       .box{
           padding: 10px 8px;
           .van-tag{
                   margin: 3px
                   
           }
       }
   }
</style>